<template>
    <popup
        :show="pupupShow"
        :clickModalClose="true"
        :title="`知识库引用（${quotes.length} 条）`"
        width="600px"
        confirm-button-text=""
        cancel-button-text=""
        @close="handleClose()"
    >
        <div class="h-[65vh]">
            <el-scrollbar>
                <div class="py-4 px-6">
                    <div
                        v-for="(item, index) in quotes"
                        :key="index"
                        class="py-[6px] px-[10px] border border-solid border-br-light rounded mb-[10px]"
                    >
                        <div class="flex items-center justify-between mb-3">
                            <el-tag type="primary">#{{ index + 1 }}</el-tag>
                            <div v-if="item.rerank_score >= 0">
                                <span class="text-xs text-tx-secondary mr-1.5">
                                    重排分数: {{ item.full_score }}
                                </span>
                            </div>
                            <div v-if="item.full_score >= 0">
                                <span class="text-xs text-tx-secondary mr-1.5">
                                    全文检索: {{ item.full_score }}
                                </span>
                            </div>
                            <div v-if="item.emb_score >= 0">
                                <span class="text-xs text-tx-secondary mr-1.5">
                                    语义检索: {{ item.emb_score }}
                                </span>
                            </div>
                        </div>
                        <div class="text-tx-secondary">
                            {{ item.question || item.chunk_texts }}
                        </div>
                        <div class="flex items-center mt-2">
                            <a
                                v-if="item.file?.path"
                                class="underline text-tx-regular hover:text-tx-primary"
                                :href="item.file.path"
                                target="_blank"
                            >
                                {{ item.file.name }}
                            </a>
                        </div>
                    </div>
                </div>
            </el-scrollbar>
        </div>
    </popup>
</template>

<script setup lang="ts">
const props = withDefaults(
    defineProps<{
        show: boolean,
        quotes?: any[],
    }>(),
    {
        show: false,
        quotes: () => []
    }
)

const emits = defineEmits<{
    (event: 'close'): void
}>()

const pupupShow = ref<boolean>(false)

const handleClose = () => {
    emits('close')
    pupupShow.value = false
}

watch(
    () => props.show,
    (val) => {
        pupupShow.value = val
    }, {
        immediate: true
    }
)
</script>
